<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
<jsp:include page="../common/adminContentHead.jsp" />
<title>课程设计管理系统</title>

</head>
<body>
	<!-- begin搜索 -->
	<div class="well well-sm" id="searchIntro">
		<form id="searchForm" class="form-inline">
			<div class="row">
				<div class="form-group  col-md-12">
					<div class="input-group">
						<span class="input-group-addon">组名</span>
						<input class="form-control" name="name">
					</div>
					
					<div class="input-group" style="margin-left: 20px;">
						<button type="button" class="btn btn-success" onclick="loadPaging(1)">搜索</button>
						<input type="reset" id="formRest" style="display: none;">
						<button type="button" class="btn btn-success" onclick="resetIntro(1)" style="margin-left: 5px;">重置</button>
					</div>
				</div>
			</div>
		</form>
	</div>
	<div class="row">
		<div class="col-md-12" id="userList">
			<div class="panel panel-default">
				<div class="panel-heading" style="padding: 5px 15px;">
					<button type="button" class="btn btn-success btm-sm" id="add_id" onclick="addGroup()">新增</button>
				</div>
				<div class="panel-body hfit" style="overflow-x: auto;">
					<input type="hidden" id="currentUserId">
					<!-- Table -->
				  	<table class="table table-bordered table-hover"  id="table_users_fqj">
					   <thead>
					      <tr>
					      	 <th style="width: 30px;"><input type="checkbox"></th>
					         <th field="name">小组名称</th>
					         <th field="belongName">指导老师</th>
					         <th field="taskName">题目</th>
					         <th field="creatTime">添加时间</th>
					         <th field="cz" render="btndos">操作</th>
					      </tr>
					   </thead>
					</table>
					<div id="table_Paging_fqj"></div>
				</div>
			</div>
		</div>
	</div>
	
	<div id="addArea" class="panel panel-default" style="padding: 10px 30px;border: none;display: none;">
		<form id="updataForm" class="form-horizontal">
			<input type="hidden" id="id">
			<div class="form-group col-md-14">
			  	<label>小组名称</label>
			  	<input type="text" id="name" name="name" class="form-control" placeholder="小组名称" >
			</div>
			<div class="form-group col-md-14">
			  	<label>题目</label>
				<select class="selectpicker" name="task" data-width="100%" data-live-search="true"  id="task" >
					<option value="">请选择</option>
			 	</select>
			</div>
			<div class="form-group col-md-14">
			  	<label>完成日期</label>
				<input type="text" name="finishDate"  class="form-control" id="finishDate">
			</div>
			
			<div class="form-group col-md-14">
			  	<label>成员</label>
				<select class="selectpicker" name="uid" data-width="100%" data-live-search="true" multiple id="student">
					<option value="">请选择</option>
			 	</select>
			</div>
 			<div id="taskDiv">
			</div>
		</form>
	</div>
	
	<div id=showMember class="panel panel-default" style="padding: 10px 30px;border: none;display: none;">
		<div class="form-group col-md-14" id="shows">
		   
		</div>
	</div>
	
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/system/bootstrapTable.js?v=<%=getServletContext().getAttribute("version") %>"></script>
	<script type="text/javascript">
		/* 初始化 start */
		$(function() {
			var divheight = $(window).height();//初始化修改div的高度
			divheight = divheight - 125;
			$(".hfit").css({
				height : divheight
			});
			loadPaging(1);

		});
		function loadUsers(pageNum){
			var url=rootpath+"/group/getlist.shtml";
			var offSet=(pageNum-1)*10;
			var searchData=$("#searchForm").getFormData();
			searchData.offSet=offSet;
			searchData.pageSize=10;
			$.post(url,searchData,function(rows){
				$("#table_users_fqj").table(rows);
				//初始化分页插件
			});
		}
		function loadPaging(pageNum){
			var url=rootpath+"/group/getlist.shtml";
			var offSet=(pageNum-1)*10;
			var searchData=$("#searchForm").getFormData();
			searchData.offSet=offSet;
			searchData.pageSize=10;
			$.post(url,searchData,function(data){
				var rows=data.items;
				var count=data.rowsCount;
				$("#table_users_fqj").table(rows);
				//初始化分页插件
				$("#table_Paging_fqj").tablePaging(1,10,count,"loadUsers");
			});
		}
		/*重置*/
		function resetIntro(){
			$("#searchForm").reset();
			loadPaging(1);
		}
		 
		/*按钮渲染*/
		function btndos(e){
			var row=e.row;
			var btns = new Array();
			btns.push("<button type=\"button\" class=\"btn btn-default btn-sm\" onclick=\"deleteGroup("+row.id+")\">删除</button>");
			btns.push("<button type=\"button\" class=\"btn btn-default btn-sm\" onclick=\"editGroup("+row.id+")\">编辑</button>");
			btns.push("<button type=\"button\" class=\"btn btn-default btn-sm\" onclick=\"showMember("+row.id+")\">查看成员及任务</button>");
			return btns.join("&nbsp;&nbsp;");;
		}
		//新增
		var type;
		function addGroup(){
		  type=1;
		  $('#id').val('');
		  $('#name').val('');
		  $('#taskDiv').html('');
		  $('#finishDate').val('');
		  save(null);
		}
		
		function save(id){
			$.ajax({ url:rootpath+"/group/findAllTopic.shtml",async:false,data:{"id":id}, success: function(data){
				 if(data.status){
	    			   var data = JSON.parse(data.data);
	      			   var opt = new Array();
	      			   opt.push('<option value="" disabled >请选择</option>');
	      			   $.each(data,function(i,obj){
	      				 opt.push('<option value="'+obj.id+'">'+obj.name+'</option>');
	      			   })
	      			   $('#task').html(opt.join(""));
	      			  $('.selectpicker ').selectpicker('refresh');
	    		   }else{
	    			   layer.msg('获取数据失败');
	    		   }
		      }});
	    	  
	    	  $.ajax({ url:rootpath+"/group/findAllStudent.shtml",async:false,data:{"id":id}, success: function(data){
	    		  if(data.status){
					   var data = JSON.parse(data.data);
		  			   var opt = new Array();
		  			   opt.push('<option value="" disabled>请选择</option>');
		  			   $.each(data,function(i,obj){
		  				 opt.push('<option value="'+obj.id+'">'+obj.name+'</option>');
		  			   })
		  			   $('#student').html(opt.join(""));
		  			 $('.selectpicker ').selectpicker('refresh');
		    		}else{
		    			layer.msg('获取数据失败');
		    		}
			      }});
	    	 var title=type==1?'添加':'编辑';
			 layer.open({
			      type: 1,
			     title: title,
			      area: ['580px', '500px'],
			   content: $('#addArea'),
			       btn: ['确定','取消'], //按钮
			       yes: function(index, layero){
	    			   var url=rootpath+"/group/save.shtml";
	    			   var datas={};
	    			   datas.id=$('#id').val();
	    			   datas.name=$('#name').val();
	    			   datas.task=$('#task').val();
	    			   datas.finishDate=$('#finishDate').val();
	    			   debugger;
					   var members=$('#taskDiv').find('textarea');
					   var memberArr= new Array();
					   $.each(members,function(i,obj){
						   var m={};
						   m.uid=$(obj).attr('data-id')
						   m.id=$(obj).attr('id')
						   m.task=$(obj).val();
						   m.gid=$('#id').val();
						   memberArr.push(m);
					   });
			    	   $.post(url,{"group":JSON.stringify(datas),"member":JSON.stringify(memberArr)},function(data){
			    		   if(data){
			    			   layer.msg('保存成功');
			    			   loadPaging(1);
			    			   layer.closeAll();
			    		   }else{
			    			   layer.msg('保存失败');
			    		   }
			    	   });
			      },
			      btn2: function(index, layero){
			    	  
			      }
			  });
		}
		
		//删除
		function deleteGroup(id){
			layer.confirm('确定删除吗？', { btn: ['确定', '取消'], title:''  }, function () {
				var url=rootpath+"/group/delete.shtml";
				$.post(url,{'id':id},function(data){
		    		   if(data.status){
		    			   layer.msg('删除成功'); 
		    			   layer.closeAll();
		    			   loadPaging(1);
		    		   }else{
		    			   layer.msg('编辑失败');
		    		   }
		    	  });
	    		layer.closeAll();   
	        }, function () {
	        	layer.closeAll();
	        });
		}
		
		//查看成员
		function showMember(id){
			 var url=rootpath+"/group/showMember.shtml";
			 $.post(url,{'id':id},function(data){
	    		   if(data.status){
					var members= topic=jQuery.parseJSON(data.data)
					var memberArr = new Array();
					$.each(members,function(i,obj){
						memberArr.push('<div    class="form-group col-md-14"><label>'+obj.uName+'的任务</label>');
						memberArr.push('<textarea rows="5" cols="80"   class="form-control" >'+obj.task+'</textarea></div>');
					});
					$('#shows').html(memberArr.join(""));
				 
					layer.open({
					      type: 1,
					     title: '查看',
					      area: ['580px', '500px'],
					   content: $('#showMember')
					  });
	    		   }else{
	    			   layer.msg('数据获取失败');
	    		   }
	    	  });
		}
	 
		$('#student').on('hidden.bs.select', function (e) {
			$('#taskDiv').html('');
			var task = new Array();
			var ids=$("#student").val();
			if(type==1){
				$.each(ids,function(i,obj){
					var text=$("#student option[value='"+obj+"']").text()
					task.push('<div  data-id="'+obj+'" class="form-group col-md-14"><label>'+text+'的任务</label>');
					task.push('<textarea rows="5" cols="80" data-id="'+obj+'" id="" class="form-control" ></textarea></div>');
				});
				$('#taskDiv').html(task.join(""));
			}else{
			   $.each(ids,function(i,obj){
					var text=$("#student option[value='"+obj+"']").text()
					task.push('<div  data-id="'+obj+'" class="form-group col-md-14"><label>'+text+'的任务</label>');
					task.push('<textarea rows="5" cols="80" data-id="'+obj+'" id="" class="form-control" ></textarea></div>');
				});
				$('#taskDiv').html(task.join(""));
			}
		});
		
		//编辑成员组
		function editGroup(id){
			 type=2;
			 save(id);
			 var url=rootpath+"/group/showMember.shtml";
			 $.post(url,{'id':id},function(data){
	    		   if(data.status){
					var members= topic=jQuery.parseJSON(data.data)
					var task = new Array();
					var uids = new Array();
					$.each(members,function(i,obj){
							uids.push(obj.uid);
							task.push('<div  data-id="'+obj.uid+'" class="form-group col-md-14"><label>'+obj.uName+'的任务</label>');
							task.push('<textarea rows="5" cols="80" data-id="'+obj.uid+'" id="'+obj.id+'" class="form-control" >'+obj.task+'</textarea></div>');
					});
					$('#student').selectpicker('val',uids);
					$('#taskDiv').html(task.join(""));
	    		   }else{
	    			   layer.msg('数据获取失败');
	    		   }
	    	  });
			 
			 var url=rootpath+"/group/findGroupById.shtml";
			 $.post(url,{'id':id},function(data){
	    		   if(data.status){
					var group= topic=jQuery.parseJSON(data.data)
					$('#id').val(group.id);
	    			$('#name').val(group.name);
	    			$('#finishDate').val(group.finishDate);
	    			$('#task').selectpicker('val',group.task);
	    		   }else{
	    			   layer.msg('数据获取失败');
	    		   }
	    	  });
		}
	 
		
	</script>
	
</body>
</html>
